<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <meta name="layout" content="save_undo" />
        <title>${Inter.printOut('Show Employee',session.language)}</title>
    </head>
    <body>
          <g:javascript src="jquery.js" />
          <g:javascript src="jquery.livequery.js" />
          <g:javascript src="budget/editFigures.js" />
        <div class="undernav">
          <span class="menuButton"><g:link class="createEmployee" action="create">${Inter.printOut('New Employee',session.language)}</g:link></span>
          <!-- This is the help button. -->
            <%  def help = Help.findByNameAndLanguage("employee_show", session.language)
            def helplink = createLink(action:'show', controller:'help', id: help.id )%>
            <a href="#" onClick="MyWindow=window.open('${helplink}','Help','width=350,height=450'); return false;">${Inter.printOut('Help',session.language)}</a>
            <!-- This is the end of the help button. -->
        </div>


        <%
          def worksInProjects = false
          if(session.mode.equalsIgnoreCase("budget")){
            def projList = Whoa.findByMemberAndWorksInCourseIsNull(employeeInstance)
            worksInProjects = (projList!=null)
          }

        %>


     <!-- <div class="mode">
              <span style="font-weight:bold">
              <g:if test="${session.mode == null || session.mode.equalsIgnoreCase('sandbox')}">
                ${Inter.printOut('Sandbox mode',session.language)}
               <g:btnSaveUndo currentView="show" currentController="employee" idProject="${employeeInstance?.id}" />
              </g:if>
              <g:else>
                ${Inter.printOut('Budget mode',session.language)}
              </g:else>
                </span>
            </div> -->
        <div class="body"style="width:100%;">
          <div class="showEmpl" style="width:98%; margin-top:20px">
            <div style="width:100%; border: 1px solid #ccc;">
            <div class="emplPic" style="float:left; margin:10px; width:128px;">
              <img src="${resource(dir:'images/skin',file:'employee_pic.png')}" alt="Employee" style="margin-top:10px;" />
            </div>
            <div class="emplInfo" style="float:left;margin:5px; width:60%">
            <h2 style="margin-left:5px;">${fieldValue(bean:employeeInstance, field:'firstName')} ${fieldValue(bean:employeeInstance, field:'lastName')}</h2>
            <table style="border:none;table-layout: fixed; width:500px;">
                      <tbody>
                          <tr>
                            <td valign="top" class="name"><b>${Inter.printOut('Title',session.language)}:</b> ${fieldValue(bean:employeeInstance, field:'title')}</td>
                          <td valign="top" class="name"><b>${Inter.printOut('Salary(Month)',session.language)}:</b> <g:formatNumber number="${employeeInstance.salary/12}" format="###"/> Kr</td>
                          </tr>
                        
                          <tr class="prop">
                            <td valign="top" class="name"><b>${Inter.printOut('Date of Birth',session.language)}</b>: <g:formatDate date="${employeeInstance.dob}" format="yyyy-MM-dd"/></td>
                          <td valign="top" class="name"><b>${Inter.printOut('Salary(Year)',session.language)}:</b> <g:formatNumber number="${employeeInstance.salary}" format="###"/> Kr</td>
                            </tr>
                          <tr>
                            <td valign="top" class="name"><b>${Inter.printOut('Address',session.language)}:</b> ${fieldValue(bean:employeeInstance, field:'street')}, ${fieldValue(bean:employeeInstance, field:'zipCode')} ${fieldValue(bean:employeeInstance, field:'city')}</td>
                          <td valign="top" class="name"><b>${Inter.printOut('Percentage Work:',session.language)}</b> <g:formatNumber number="${employeeInstance.percentageWork}" format="###"/> %</td>
                          </tr>
                          <tr>
                            <td valign="top" class="name"><b>${Inter.printOut('Email:',session.language)}</b> ${fieldValue(bean:employeeInstance, field:'email')}</td>
                          <td valign="top" class="name"><b>${Inter.printOut('Hours Per Year',session.language)}:</b> <g:formatNumber number="${employeeInstance.workingHoursPerYear}" format="###"/> h</td>
                          </tr>
                          <tr>
                            <td valign="top" class="phoneNumber"><b>${Inter.printOut('Phone number:',session.language)}</b> ${fieldValue(bean:employeeInstance, field:'phoneNumber')}</td>
                          <td valign="top" class="name"><b>${Inter.printOut('Hired By',session.language)}:</b> ${employeeInstance?.hiredBy?.name}
                      </td>
                          </tr>
                      </tbody>
                  </table>
            </div>
            <div class="buttons" style="clear:both">
                  <%
          def a = session.access
          a.refresh()
          %>
                <g:if test="${(!session.mode.equalsIgnoreCase('budget')) || (session.mode.equalsIgnoreCase('budget') && !a.isBudgetLocked()) || (session.mode.equalsIgnoreCase('budget') && a.isBudgetLocked() && !worksInProjects)}">
                  <g:form>
                      <input type="hidden" name="id" id="employeeId" value="${employeeInstance?.id}" />
                      <span class="button"><g:actionSubmit class="editEmployee" value="${Inter.printOut('Edit',session.language)}" action="Edit" /></span>
                      <span class="button"><g:actionSubmit class="deleteEmployee" onclick="return confirm('${Inter.printOut('Sure',session.language)}');" value="${Inter.printOut('Delete',session.language)}" action="Delete" /></span>
                  </g:form>
                </g:if>
                <g:else>
                  Budget locked, employee not editable
                </g:else>
                </div>
            </div>

                <div class="projectDetails" style="clear:both">
                  <h2>${Inter.printOut('Project details',session.language)}</h2> <!--  margin-top:25px; -->
                  <!-- Link useful for javascript -->
                    <g:link class="urlUpdate" controller="employee" action="updateFigures"></g:link>
                    <g:link class="urlArrow" controller="employee" action="updateFigures"></g:link>
                    <g:link class="urlUpdateHours" controller="project" action="updateHours"></g:link>
                  <!-- end useful link which don't appear in the page -->
                  <table class="generalHours" width="100%" style="table-layout: fixed">
                     <thead>
                      <tr>
                        <!--Admin creating accounts shall be able to fill in nr of hours worked per year OR percent per year -->
                        <th>${Inter.printOut('Percentage Work:',session.language)}</th>  <!--inputHours/totalHours -->
                        <th>${Inter.printOut('Working hours (per year)',session.language)}</th>    <!--inputHours -->
                        <th>${Inter.printOut('Work not assigned',session.language)}</th>           <!--(total-actualHours)/ -->
                        <th>${Inter.printOut('Hours not assigned',session.language)}</th>          <!--actualHours -->
                      </tr>
                    </thead>                                 <!--to add picture      <img src="url(../images/skin/users.png)" /> -->
                    <tbody>
                      <tr>
                        <td>
                          <g:if test="${(!session.mode.equalsIgnoreCase('budget')) || (session.mode.equalsIgnoreCase('budget') && !a.isBudgetLocked()) || (session.mode.equalsIgnoreCase('budget') && a.isBudgetLocked() && !worksInProjects)}">
                            <span id ="percentageWork" class="editableFigures" ><g:formatNumber number="${employeeInstance?.percentageWork}" format="###"/></span> %
                            <span id="percentageWorkUpArrow" class="editableFiguresArrow" ><img alt="up" style="vertical-align:text-bottom;" src="${resource(dir:'images',file:'up2.png')}"/></span>
                            <span id="percentageWorkDownArrow" class="editableFiguresArrow" ><img alt="down" style="vertical-align:text-bottom;" src="${resource(dir:'images',file:'down2.png')}"/></span>
                          </g:if>
                          <g:else>
                            <span id ="percentageWork" ><g:formatNumber number="${employeeInstance?.percentageWork}" format="###"/></span> %
                          </g:else>
                        </td>     <!--incomeFigures is the class for dubbelclikcing, employeeInstance.percentageWork OR getPercentageWorkingFrom(hour) -->
                        <td>
                          <g:if test="${(!session.mode.equalsIgnoreCase('budget')) || (session.mode.equalsIgnoreCase('budget') && !a.isBudgetLocked()) || (session.mode.equalsIgnoreCase('budget') && a.isBudgetLocked() && !worksInProjects)}">
                            <span id ="hoursWork" class="editableFigures" ><g:formatNumber number="${employeeInstance?.getWorkingHoursPerYear()}" format="###"/> h<img alt="edit" style="vertical-align:text-bottom;" src="${resource(dir:'images/skin',file:'pencil.png')}"/></span>
                            
                          </g:if>
                        <g:else>
                          <span id ="hoursWork">
                            <g:formatNumber number="${employeeInstance?.getWorkingHoursPerYear()}" format="###"/> h 
                          </span>
                        </g:else>
                        </td><!--employeeInstance.percentageWork*getWorkingHoursPerYear OR hour -->
                        <td><g:formatNumber number="${employeeInstance?.percentageNotAssigned()}" format="###"/> % </td><!--(above-employeeInstance.actualWorkingHoursPerYear())/above-->
                        <td><g:formatNumber number="${employeeInstance?.hoursNotAssigned()}" format="###"/> h</td><!--2above-employeeInstance.actualWorkingHoursPerYear() -->
                      </tr>
                    </tbody>
                  </table>
                  <table style="table-layout: fixed">
                    <thead>                                  <!--totalHours = 1700 or 1732 (getWorkingHoursPerYear), inputHours = hours input when employee created (getPercentageWorkingFromHours()), actualHours = sum of hours in list of project (actualWorkingHoursPerYear())(-->
                      <tr>
                        <th>${Inter.printOut('Active in Project',session.language)}</th>
                        <th>${Inter.printOut('Hours',session.language)}</th>
                        <th>${Inter.printOut('Percentage',session.language)}</th>
                      </tr>
                    </thead>
                    <tbody>
                        <g:each var="m" in="${whoaList}">       <!-- for every element (m, a whoa) in the list (whoaList) -->
                          <g:if test="${ModeAccess.isAvailableInCurrentMode(session.mode,m?.member?.mode)}">
                            <tr>
                              <td><g:link action="show" controller="project" id="${m?.worksInProject?.id}">${m?.worksInProject?.name} </g:link></td>
                              <td>
                                <g:if test="${(!session.mode.equalsIgnoreCase('budget')) || (session.mode.equalsIgnoreCase('budget') && !a.isBudgetLocked()) || (session.mode.equalsIgnoreCase('budget') && a.isBudgetLocked() && !worksInProjects)}">
                                  <span class="hoursFigures" id="updateHours" title="${m.id}">
                                </g:if>
                                <g:else>
                                  <span id="updateHours" title="${m.id}"></g:else><g:formatNumber number="${m?.hours}" format="###"/></span>
                                  <span class="modifyInput"> h<img alt="edit" style="vertical-align:text-bottom;" src="${resource(dir:'images/skin',file:'pencil.png')}"/></span>
                                  
                              </td>
                                <td>
                                  <g:formatNumber number="${(m?.hours/employeeInstance.hoursForAge())*100}" format="###"/> %
                                </td>  <!-- Percentage calculated from worked hours in a specific project in relation to total worked hours for that year -->
                           </tr>
                                <!-- <g:formatNumber number="${m?.member?.salary}" format="SEK ##,##0" />-->
                          </g:if>
                        </g:each>
                        <tr>
                           <td>${Inter.printOut('TOTAL',session.language)}:</td>
                           <td><g:formatNumber number="${employeeInstance.actualWorkingHoursPerYear()}" format="###"/> h</td>
                           <td><g:formatNumber number="${employeeInstance.actualWorkingPercentagePerYear()}" format="###"/> %</td>
                        </tr>
                    </tbody>
                  </table>
              </div>

          </div>

                
               
             
              
            
        </div>
    </body>
</html>
